<template>
  <div class="prop">
    <div class="prop-container">
      <el-dialog
        title="会员人数"
        :visible.sync="openswiper"
        width="80%"
        :style="{ top: '50px' }"
        :before-close="handleClose"
        :modal-append-to-body="false"
        :open="opendialog"
      >
        <div>
          <Company :companyListdata="swiperdata" :columnwidth="columnwidth" ref="closeFn"></Company>
        </div>
         <!-- <div style="color: #fff;" @click="dd">{{ openswiperrpop }}2222</div> -->
      </el-dialog>
    </div>
  </div>
</template>

<script>
// 使用辅助函数
// import {mapState, mapMutations}  from 'vuex'
import Company from "../system/company";
// import { listCompany } from "@/api/system/company";
export default {
  name: "bigscreenprop",
  components: { Company },
  props: {
    openswiper: {
      type: Boolean,
      default: false,
    },
    swiperdata:{
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      // 商会企业表格数据
      datalist: [],
      objres: [],
      columnwidth:360,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        companyName: null,
        companyDescription: null,
      },
    };
  },
  created() {
   
  },
  mounted() {
     const closeFn = this.$refs.closeFn;
      console.log(this.swiperdata,'sun');
    // this.getListd();
  },
  computed: {},
  methods: {
    close() {
    //   const closeFn = this.$refs.closeFn;
      if (closeFn) {
        closeFn.getListd = () => {};
      }
    },
    /** 查询商会企业列表 */
    // getListd() {
    //   listCompany(this.queryParams).then((response) => {
    //     // 拿到数据进行查找如果找到就返回真没有找到就返回-1
    //     const obj = this.openswiperrpop.item;
    //     const objres = response.rows.find(
    //       (item) => item.companyName === obj.companyName
    //     );
    //     this.objres.push(objres);
    //   });
    // },
    // ...mapMutations(['SHOW_HIDEEN']),
    handleClose(e) {
      this.$emit("openswiperrpopFn", false);
    },
    dd() {
  
    },
    opendialog() {
      console.log(2332);
    },
  },
};
</script>

<style lang="scss" scoped>
.prop {
  // position: relative;

  .prop-container {
    width: 80%;
    height: 80% !important;

    ::v-deep .el-dialog {
      background: url("../../assets/images/prop.png") no-repeat center center;
      background-size: 100% 100% !important;
      height: 80%;
    }
    ::v-deep .el-dialog__body {
      padding-bottom: 80px !important;
      .el-table {
        color: #fff;
        background-color: #ffffff00 !important;
        // height: 80% !important;
      }
    }

    ::v-deep .el-dialog__header {
      background: url("../../assets/images/lng_title_bg1.png") no-repeat center
        center;
      background-size: 90% 60% !important;
      padding: 10px;
      .el-dialog__title {
        padding: 0 150px !important;
        color: #fff !important;
      }
    }
  }
}
::v-deep .el-table th,
::v-deep .el-table tr,
::v-deep .el-table td {
  //  background-color: red !important;
  // background: transparent !important;
  background: rgba(1, 51, 122, 0%);
  border: 0; //去除表格
}
::v-deep .el-dialog__headerbtn .el-dialog__close {
  color: #fff;
  font-size: 20px;
  font-weight: 700;
}
::v-deep .el-table .el-table__header-wrapper th {
  color: #fff !important;
  font-size: 18px !important;
}
.el-table th.el-table__cell.is-leaf {
  border-bottom: #e6ecdf00 !important;
}
.el-table::before {
  background-color: #e6ebf508;
}
::v-deep .el-dialog__body {
  padding: 30px 140px !important;
}
::v-deep .pagination-container {
  background: none; //#1a4676
}
::v-deep .el-input--small .el-input__inner {
  background-color: #1a4676;
}
::v-deep .el-form--inline .el-form-item__label {
  color: #fff;
}
::v-deep .el-select .el-input.is-focus .el-input__inner {
  background-color: #1a4676;
}
::v-deep .el-pagination.is-background .btn-prev {
  background: #1a4676;
}
::v-deep .el-pagination.is-background .btn-next {
  background-color: #1a4676;
}
::v-deep .el-pagination .el-select .el-input .el-input__inner {
  background-color: #1a4676;
  color: #fff;
}
::v-deep .el-pagination__editor.el-input .el-input__inner {
  background-color: #1a4676;
  color: #fff;
}
::v-deep .cell .el-tag {
  background-color: #1a4676;
}
::v-deep .el-table::before {
  background-color: #1a4676 !important;
}
::v-deep .el-table__body tbody tr:hover > td {
  background-color: #666 !important;
}
::v-deep .el-pagination__total {
  color: #fff !important;
}
::v-deep .el-pagination__jump {
  color: #fff !important;
}
//  嵌套弹框样式
</style>
